import { Button, Table, Image } from 'antd';
import { useCallback, useMemo, useState } from 'react';


const List = (props) => {
  const columns = useMemo(() => [
    {
      key: 'name',
      dataIndex: 'name',
      title: '姓名',
    },
    {
      key: 'sex',
      dataIndex: 'sex',
      title: '性别',
      render: (_, { sex }) => {
        return sex / 1 ? '男' : '女'
      }
    },
    {
      key: 'imgpath',
      dataIndex: 'imgpath',
      title: '图片',
      render: (_, { imgPath }) => {
        return <Image
          height={100}
          src={imgPath}
        />
      }
    },
    {
      key: 'type',
      dataIndex: 'type',
      title: '评论类型',
    },
    {
      key: 'content',
      dataIndex: 'content',
      title: '备注'
    },
    {
      title: '操作',
      render: (_, item) => {
        return <>
          <Button danger onClick={() => delItem(item)}>删除</Button>
        </>
      }
    }
  ], []);
  const delItem = useCallback((item) => {
    props.delDateList(item , props)
  }, [props])
  return (
    <>
      <Table className='tableContent' scroll={{
        y: 540,
      }} pagination={{ position: ['none', 'none'] }} columns={columns} dataSource={props.dataList} />
    </>
  )
};
export default List;